import React, { useEffect, useState } from 'react'

import Comment from './pages/Comment'
import Home from './pages/Home'
import Search from './pages/Search'


export default function App () {

    const [curHash, setCurHash] = useState('')
    useEffect(() => {
        // console.log(window.location.hash.slice(1))
        // setCurHash(window.location.hash.slice(1))

        changeHash()
    }, [])

    useEffect(() => {
        window.addEventListener('hashchange', changeHash)
    }, [])

    const changeHash = () => {
        setCurHash(window.location.hash.slice(1))
    }



    return (
        <>
            <div>App</div>
            <ul>
                <li>
                    <a href="#/home">首页</a>
                </li>
                <li>
                    <a href="#/comment">评论</a>
                </li>
                <li>
                    <a href="#/search">搜索</a>
                </li>
            </ul>



            {curHash === '/comment' && <Comment></Comment>}
            {curHash === '/home' && <Home></Home>}
            {curHash === '/search' && <Search></Search>}





        </>

    )
}
